<template>
  <Row>
    <Col :span="10">
      <ScheduleOutlined style="margin-right: 10px; color: #0960bd; font-size: 20px" />
      <span style="">{{ info.settleCode }}</span>
      <CopyOutlined
        style="margin-left: 10px; color: #0960bd; font-size: 20px"
        @click="copyText(info.settleCode)"
    /></Col>
  </Row>
  <Row style="margin-top: 10px; color: #6b6d6e">
    <Col :span="6">
      <p>承运商</p>
      <p>{{ info.carrierName || '-' }}</p>
    </Col>
    <Col :span="4">
      <p>结算周期</p>
      <p>{{ info.goodsWeight }}</p>
    </Col>
    <Col :span="4">
      <p>结算金额</p>
      <p>{{ info.quotePrice || '-' }}</p>
    </Col>
    <Col :span="4">
      <p>账单时间</p>
      <p>{{ info.accountPrice || '-' }}</p>
    </Col>
    <Col :span="3" style="color: #f43f5e">
      <p>状态</p>
      <p>{{ info.deviation || '-' }}</p>
    </Col>
  </Row>
</template>
<script lang="ts" setup>
  import { CopyOutlined, ScheduleOutlined } from '@ant-design/icons-vue';
  import { Row, Col } from 'ant-design-vue';
  import { copyText } from '@/utils/copyTextToClipboard';

  // 获取外部传入的数据
  const props = defineProps({
    info: {
      type: Object,
      default: () => {
        return {};
      },
    },
  });
  console.log('info', props);
</script>

<style scoped></style>
